<template>
    <div style="padding-top: 1%;padding-left: 0.5%">
        <div class="demo-input-suffix">
            <el-input v-model="name" placeholder="系列名称" style="width: 350px"></el-input>
            <el-button type="primary" icon="el-icon-search" @click="queryName()"></el-button>
            <el-button type="primary" @click="init()">显示所有</el-button>
        </div>
        <div>
            <el-table :data="tableData" stripe>
                <el-table-column prop="number" label="编号"></el-table-column>
                <el-table-column prop="name" label="名称"></el-table-column>
            </el-table>
        </div>
        <div>
            <el-pagination
                    background
                    layout="prev, pager, next, jumper"
                    :current-page="pageable.page"
                    :total="totalElements"
                    :page-size="pageable.size"
                    @current-change="changePage">
            </el-pagination>
        </div>
    </div>
</template>

<script>
    import {mapActions} from "vuex"
    import tips from "@/assets/script/util/tips";
    import {Pageable} from "@/assets/script/model";

    export default {
        name: "List",
        methods: {
            //初始化时执行
            ...mapActions("series", ["APaging"]),
            async init() {
                await this.showTable({'name': null})
            },
            async queryName() {
                const name = this.name;
                console.log(name)
                if (name === null || name === "") {
                    tips.warn("查询名称不能为空")
                    return false;
                }
                await this.showTable({"name": name})
            },
            async showTable(param) {
                const result = await this.APaging(param);
                if (result.status === 200) {
                    const page = result.data;
                    this.tableData = page.content;
                    this.totalElements = page.totalElements;
                } else {
                    await tips.error(result.message);
                }
            },
            async changePage(page) {
                this.pageable.page = page;
                await this.showTable(Object.assign({}, this.pageable, {"name": this.name}))
            },
        },
        //绑定数据
        data() {
            return {
                tableData: [],
                name: '',
                isExit: false,
                pageable: new Pageable(),
                totalElements: 0
            }
        },
        mounted() {
            this.init();
        }
    }
</script>

<style scoped>

</style>